import React from 'react';
import { Form, Input, Button } from 'antd';

import styles from './styles.module.less';

const ContactUS = () => {

  const onFinish = (data) => {
    console.log(data);
  }

  return (
    <div className={styles.contact_US}>
      <div className={styles.form_box}>
        <div className={styles.module_name}>给我们发送信息</div>
        <Form layout='vertical' onFinish={onFinish}>
          <div className={styles.form_row}>
            <Form.Item name='name'>
              <Input name='name' placeholder='姓名' />
            </Form.Item>
            <Form.Item name='moniker'>
              <Input name='moniker' placeholder='名' />
            </Form.Item>
          </div>
          <div className={styles.form_row}>
            <Form.Item name='email'>
              <Input name='email' placeholder='电子邮件' />
            </Form.Item>
            <Form.Item name='phone'>
              <Input name='phone' placeholder='Telephone' />
            </Form.Item>
          </div>
          <Form.Item name='company'>
            <Input name='company' placeholder='公司' />
          </Form.Item>
          <Form.Item name='desc'>
            <Input.TextArea name='desc' placeholder='Type you message...' />
          </Form.Item>
          <div className={styles.form_footer_box}>
            <Button type='primary' htmlType='submit'>提交</Button>
          </div>
        </Form>
      </div>
    </div>
  )
};

export default ContactUS;